<template>
  <div class="page-container">
    <div class="card">
      <page-title :title="title"></page-title>
      <el-row class="search-container" :gutter="20">
        <el-col :xs="24" :sm="12" :md="8">
          <el-card shadow="hover">
            <el-image @click="toSystemConfig" src="https://blog-yk0504.oss-cn-hangzhou.aliyuncs.com/cover/20230530223559.png" class="card-image"></el-image>
            <div style="float: right; padding-right: 1rem;">
              <el-button type="text" class="button" @click="toSystemConfig">点击进入系统配置</el-button>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import PageTitle from '../../../components/PageTitle/index'

export default {
  name: 'ConfigIndex',

  components: { PageTitle },

  data () {
    return {
      // 页面标题
      title: ''
    }
  },

  mounted () {
    // 赋值当前页面内容
    this.title = this.$route.meta.title
  },

  methods: {
    toSystemConfig () {
      this.$router.push('/config-content/system')
    },
    toAboutMe () {
      this.$router.push('/config-content/about-me')
    }
  }
}
</script>

<style lang="scss" scoped>
.card-image {
  display: flex;
  justify-content: center;
  height: 15.625rem;
  cursor: pointer;
}
.el-card {
  border-radius: 0.75rem;
}
</style>
